import React, { useState, useEffect } from 'react';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Textarea } from '@/components/ui/textarea';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Save, X, BookText } from 'lucide-react';

export default function StandardForm({ standard, onSubmit, onCancel }) {
  const [localStandard, setLocalStandard] = useState({});

  useEffect(() => {
    // 新建标准时自动生成时间戳作为标准编号
    const initialData = standard || {
      code: '', 
      name: '',
      publicationYear: '',
      issuingAuthority: '',
      status: 'active',
      category: 'national',
      description: ''
    };
    setLocalStandard(initialData);
  }, [standard]);

  const handleFieldChange = (field, value) => {
    setLocalStandard(prev => ({ ...prev, [field]: value }));
  };

  const handleSubmit = (e) => {
    e.preventDefault();
    onSubmit(localStandard);
  };

  return (
    <Card className="mb-6 shadow-lg border-green-200" id="standard-form">
      <CardHeader className="bg-green-50">
        <CardTitle className="flex items-center justify-between">
          <span className="flex items-center gap-2">
            <BookText className="w-5 h-5 text-green-600" />
            {standard ? `编辑标准: ${standard.name}` : '新建标准规范'}
          </span>
          <Button variant="ghost" size="icon" onClick={onCancel}>
            <X className="w-4 h-4" />
          </Button>
        </CardTitle>
      </CardHeader>
      <CardContent className="p-6">
        <form onSubmit={handleSubmit} className="space-y-6">
          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
            <div>
              <label className="block text-sm font-medium mb-1">标准名称</label>
              <Input
                value={localStandard.name || ''}
                onChange={(e) => handleFieldChange('name', e.target.value)}
                placeholder="例如: 架空输电线路施工及验收规范"
                required
              />
            </div>
            {/* 恢复标准编号输入框并设置为只读（可选） */}
            <div>
              <label className="block text-sm font-medium mb-1">标准编号</label>
              <Input
                value={localStandard.code || ''}
                onChange={(e) => handleFieldChange('code', e.target.value)}
                placeholder="例如: GB 50233-2014"
                readOnly={!standard} // 新建时只读，编辑时可修改
                required
              />
            </div>
          </div>

          {/* 其余表单内容保持不变 */}
          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
            <div>
              <label className="block text-sm font-medium mb-1">发布年份</label>
              <Input
                value={localStandard.publicationYear || ''}
                onChange={(e) => handleFieldChange('publicationYear', e.target.value)}
                placeholder="例如: 2014"
              />
            </div>
            <div>
              <label className="block text-sm font-medium mb-1">发布单位</label>
              <Input
                value={localStandard.issuingAuthority || ''}
                onChange={(e) => handleFieldChange('issuingAuthority', e.target.value)}
                placeholder="例如: 中华人民共和国住房和城乡建设部"
              />
            </div>
          </div>
          
          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
             <div>
              <label className="block text-sm font-medium mb-1">标准类别</label>
              <Select value={localStandard.category || 'national'} onValueChange={(value) => handleFieldChange('category', value)}>
                <SelectTrigger>
                  <SelectValue placeholder="选择类别" />
                </SelectTrigger>
                <SelectContent>
                  <SelectItem value="national">国家标准</SelectItem>
                  <SelectItem value="industry">行业标准</SelectItem>
                  <SelectItem value="local">地方标准</SelectItem>
                  <SelectItem value="enterprise">企业标准</SelectItem>
                </SelectContent>
              </Select>
            </div>
            <div>
              <label className="block text-sm font-medium mb-1">状态</label>
              <Select value={localStandard.status || 'active'} onValueChange={(value) => handleFieldChange('status', value)}>
                <SelectTrigger>
                  <SelectValue placeholder="选择状态" />
                </SelectTrigger>
                <SelectContent>
                  <SelectItem value="active">现行</SelectItem>
                  <SelectItem value="inactive">废止</SelectItem>
                  <SelectItem value="superseded">被替代</SelectItem>
                </SelectContent>
              </Select>
            </div>
          </div>

          <div>
            <label className="block text-sm font-medium mb-1">简要描述</label>
            <Textarea
              value={localStandard.description || ''}
              onChange={(e) => handleFieldChange('description', e.target.value)}
              placeholder="简要说明该标准的主要内容和适用范围"
              rows={3}
            />
          </div>

          <div className="flex justify-end gap-3 pt-4 border-t">
            <Button type="button" variant="outline" onClick={onCancel}>
              <X className="w-4 h-4 mr-2" />
              取消
            </Button>
            <Button type="submit" className="bg-green-600 hover:bg-green-700">
              <Save className="w-4 h-4 mr-2" />
              保存标准
            </Button>
          </div>
        </form>
      </CardContent>
    </Card>
  );
}